<template>
<div class="add-dept">
  <el-dialog :close-on-click-modal="false"
  modal-append-to-body lock-scroll top="10%"
  :title="title" :visible.sync="dialogVisible"
  width="50%"
  @close="closeDailog">
    <v-form
       :initData="form"
       :initForm = "dialogVisible"
       @cancel="closeDailog"
       @submit="submit"
    ></v-form>
  </el-dialog>
</div>
</template>
<script>
  import Form from './Form'
  export default {
    name: 'DeptDailog',
    data () {
      return {
        dialogVisible: false
      }
    },
    props: {
      form: {
        type: Object,
        default: function () {
          return {}
        }
      },
      title: String,
      isShow: Boolean
    },
    watch: {
      isShow () {
        this.dialogVisible = this.isShow
      }
    },
    components: {
      'v-form': Form
    },
    methods: {
      submit (val) {
        let data = {
          addForm: val,
          bool: false,
          type: 'submit'
        }
        this.$emit('close', data)
      },
      closeDailog () {
        this.dialogVisible = false
        let data = {
          bool: false,
          type: 'cancle'
        }
        this.$emit('close', data)
      }
    }
  }
</script>
<style lang="stylus" scoped>
</style>
